<template>
  <fks-dialog
    fullscreen
    :visible.sync="Visible"
    width="1200px"
    :title="title ? title : ''"
    :append-to-body="true"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    class="dialog-read"
    top="0"
    @close="close"
  >
    <div :style="{ height: '100%' }">
      <read
        :id="id ? id : ''"
        :is-dialog="true"
        :is-revision="isRevision"
      />
    </div>
  </fks-dialog>
</template>

<script>
import Read from '../Read/index'
export default {
  name: 'DialogRead',
  components: { Read },
  props: {
    id: String,
    isRevision: {
      type: Boolean,
      default: false
    },
    visible: {
      type: Boolean,
      default: false
    },
    title: String,
    height: String
  },
  data() {
    return {
      Visible: false
    }
  },
  watch: {
    visible(val) {
      this.Visible = val
    },
    id(val) {
      if (val) {
        this.id = val
      }
    }
  },
  methods: {
    close() {
      this.$emit('close')
    }
  }
}
</script>

<style scoped lang="scss">
// .dialog-read-wrapper {
//   height: 100%;
//   // margin-top: calc(10vh - 35px)
// }
.dialog-read ::v-deep {
  height: 100%;

  .fks-dialog__body {
    height: calc(100% - 57px) !important;
  }
}
</style>